
<template>
  <el-menu
    id="navigator_id"
    :router="true"
    text-color="#fff"
    active-text-color="#ffd04b"
    background-color="#545c64"
  >
    <el-menu-item index="/login">
      <span v-if="userToken === ''">
        <i class="el-icon-menu"></i>登录
      </span>
      <span v-else>
        <el-avatar src="../assets/avatar.png"></el-avatar> 登出
      </span>
    </el-menu-item>
    <el-menu-item index="/video">
      <i class="el-icon-document"></i>视频
    </el-menu-item>
    <el-menu-item index="/animate">
      <i class="el-icon-setting"></i>动画
    </el-menu-item>
    <el-menu-item index="/udp">
      <i class="el-icon-location"></i>UDP测试
    </el-menu-item>
  </el-menu>
</template>
<script>
import { mapGetters } from "vuex";

export default {
  computed: {
    ...mapGetters(["userToken"]),
  },
}
</script>

<style scoped>
#navigator_id li {
  outline: 1px solid #545c64;
}
</style>
